<template>
    <div id="dashBoard-content" class="dashBoard-content">
        <h1>仪表盘管理</h1>
      <div class="slide-nav">
        <el-tabs v-model="activeName" class="tabs" @tab-click="handleClick">
          <el-tab-pane label="All(重要指标)" name="All">
            <single-tab :dash-name="0"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="CPU(中央处理器)" name="CPU">
            <single-tab :dash-name="1"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Disk(磁盘)" name="Disk">
            <single-tab :dash-name="2"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="System(系统)" name="System">
            <single-tab :dash-name="11"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="mem(内存)" name="mem">
            <single-tab :dash-name="7"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Kernel(内核)" name="Kernel">
            <single-tab :dash-name="5"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Processes(进程)" name="Processes">
            <single-tab :dash-name="9"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Net(网络)" name="Net">
            <single-tab :dash-name="8"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Linux_sysctl_fs(文件管理系统)" name="Linux_sysctl_fs">
            <single-tab :dash-name="6"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="DiskIO(磁盘IO)" name="DiskIO">
            <single-tab :dash-name="3"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Interrupts(硬中断)" name="Interrupts">
            <single-tab :dash-name="4"></single-tab>
          </el-tab-pane>
          <el-tab-pane label="Soft_interruts(软中断)" name="Soft_interruts">
            <single-tab :dash-name="10"></single-tab>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
</template>
<script setup>
import { ref } from 'vue'
import singleTab from '@/components/singleTab.vue'

const dataList = ['All','CPU(中央处理器)','Disk(磁盘)','DiskIO(磁盘IO)','Interrupts(硬中断)','Kernel(内核)','Linux_sysctl_fs(文件管理系统)','mem(内存)','Net(网络)','Processes(进程)','Soft_interruts(软中断)','System(系统)']
const activeName = ref(dataList[0])
const handleClick = (tab, event) => {
  console.log("aaa",tab,event);
}
</script>

<style>
.dashBoard-content {
  width: 100%;
}
.dashBoard-content h1 {
  font-size: 36px;
  color: rgb(0, 81, 255);
  margin-bottom: 20px;
  font-weight: 750;
}
</style>